import React, {Component} from 'react'
/*
* 这里我使用一个函数组件
* 使用函数组件的话  就需要让函数接收一个props
* */
const allMessages = [
        {id:1, title:'message001', content:'Fuck You'},
        {id:2, title:'message002', content:'Fuck Shit'},
        {id:3, title:'message003', content:'Fuck Stupid'},
        {id:4, title:'message004', content:'Fuck SB'},
]

export default class MessageDetail extends Component {



    render() {
        // 得到请求参数中的id
        const {id} = this.props.match.params
        // 得到对应的message
        // 返回第一个结果为true的数组元素
        const message = allMessages.find((m) => m.id === id * 1)  // 将字符串id变成数字id
        // debugger   调试
        return (
            <ul>
                <li>ID: {message.id}</li>
                <li>TITTLE:{message.title}</li>
                <li>CONTENT:{message.content}</li>
            </ul>
        )
    }
}